<template>
  <div v-if="visible">
    <!-- 新增或修改组织 -->
    <el-dialog :visible.sync="visible"
               @close="dialogClose"
               @open="dialogOpen"
               :close-on-click-modal="false"
               :title="dialogStatus==='create'?'新增组织名称':'修改组织名称'"
               width="30%">
      <el-form :model="editDeptForm"
               :rules="editDeptFormRules"
               ref="editDeptForm"
               label-width="80px">
        <el-form-item label="组织名称"
                      prop="name">
          <el-input v-model="editDeptForm.name"
                    autocomplete="off"
                    placeholder="请输入组织名称"
                    style="width:100%!important"></el-input>
        </el-form-item>
        <el-form-item>
          <el-checkbox v-model="isProject">是项目部</el-checkbox>
          <!-- <el-select v-model="editDeptForm.dept_type"
                     style="width:100%!important"
                     placeholder="请选择">
            <el-option v-for="item in deptTypeList"
                       :key="item.value"
                       :label="item.name"
                       :value="item.value">
            </el-option>
          </el-select> -->
        </el-form-item>
        <!-- <el-form-item v-if="dialogStatus==='update'"
                      label="上级组织"
                      prop="p_name">
          <el-select readonly
                     @focus="chooseUpperDept"
                     v-model="editDeptForm.p_name"
                     autocomplete="off"
                     popper-class="select-class"
                     style="width:100%!important"></el-select>
        </el-form-item> -->
        <el-form-item label="备注"
                      class="add_tips">
          <el-input v-model="editDeptForm.remark"
                    autocomplete="off"
                    style="width:100%!important"></el-input>
        </el-form-item>
      </el-form>
      <div style="text-align:center;">
        <el-button @click="dialogClose"
                   id="back-style">返 回</el-button>
        <el-button type="primary"
                   @click="editDept"
                   id="save-style">保 存</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="chooseDeptDialogVisible"
               title="选择上级组织">
      <OrganizationTreeTemp :rightMenu="false"
                            :curMenu.sync="curNode"
                            :isPersonLibraryPage.sync="isPersonLibraryPage"
                            :personLibraryObsArr.sync="treeDataChild"></OrganizationTreeTemp>
      <div style="text-align:center;">
        <el-button @click="chooseDeptDialogVisible=false">返 回</el-button>
        <el-button type="primary"
                   @click="chooseUpperDeptConfirm">保 存</el-button>
      </div>
    </el-dialog>
  </div>

</template>
<script>
import { backEvaluateApi } from '@/services/ProjectCenter'
import { standardCodeApi } from '@/services/StandardCode'
import { organizationApi } from '@/services/CompanySetting'
import OrganizationTreeTemp from '@/components/OrganizationTree/OrganizationTreeTemp'
export default {
  data () {
    return {
      isPersonLibraryPage: true,
      deptType: '',
      isProject: false, //是否为项目部
      visible: false,
      editDeptForm: {
        name: '',
        remark: '',
        org_type: '',
        dept_type: ''
      },
      // 组织类型标准码列表
      deptTypeList: [],
      editDeptFormRules: {
        name: [
          { required: true, message: '请输入组织名称', trigger: 'blur' }
        ],
        dept_type: [
          { required: true, message: '请选择组织类型', trigger: 'blur' }
        ]
      },
      chooseDeptDialogVisible: false,
      curNode: {}
    }
  },
  props: {
    treeDataChild: {
      type: Array,
      default: () => {
        return []
      }
    },
    dialogVisible: Boolean,
    dialogForm: Object,
    dialogStatus: String,
    callback: Function
  },
  name: 'EditDeptDialog',
  components: {
    OrganizationTreeTemp
  },
  watch: {
    dialogVisible (newval, oldval) {
      this.visible = newval
    },
    dialogForm: {
      handler (newval, oldval) {
        this.editDeptForm = Object.assign(this.editDeptForm, JSON.parse(JSON.stringify(newval)))
        this.editDeptForm.node_type = '2'
        this.deptType = this.editDeptForm.dept_type //没修改之前的组织类型
      },
      deep: true
    },
    dialogStatus (newval, oldval) {
      if (newval === 'update') {
        this.editDeptForm.name = this.editDeptForm.node_name
        if (this.editDeptForm.dept_type === '1') {
          this.isProject = false
        } else {
          this.isProject = true
        }
      } else if (newval === 'create') {
        this.editDeptForm.name = ''
        this.editDeptForm.dept_type = ''
        this.editDeptForm.remark = ''
        this.isProject = false
      }
    },
    curNode: {
      handler (newval) {
        let tempData = {}
        console.log(newval, 'watch')

      },
      deep: true
    },
  },
  methods: {
    chooseUpperDept () {
      this.chooseDeptDialogVisible = true
    },
    chooseUpperDeptConfirm () {
      if (this.curNode.node_id === this.editDeptForm.node_id) {
        this.$message.warning('不能选择当前组织')
      } else if (this.curNode.node_type === '3') {
        this.$message.warning('必须选择单位或组织')
      } else {
        this.editDeptForm.p_name = this.curNode.node_name
        this.editDeptForm.org_type = this.curNode.org_type || ''
        this.chooseDeptDialogVisible = false
      }
    },
    dialogOpen () {
      // this.$refs.editDeptForm.resetFields()
    },
    dialogClose () {
      this.$refs.editDeptForm.resetFields()
      this.$emit('update:dialogVisible', false)
      this.$emit('update:dialogStatus', '')
    },
    editDept () {
      this.$refs.editDeptForm.validate((valid) => {
        if (valid) {
          if (this.dialogStatus === 'create') {
            this.createDept()
          } else if (this.dialogStatus === 'update') {
            this.updateDept()
          }
        }
      })
    },
    // 新增组织
    createDept () {
      if (this.isProject) {
        this.editDeptForm.dept_type = '2'
      } else {
        this.editDeptForm.dept_type = '1'
      }
      // organizationApi.createOrg({
      backEvaluateApi.saveObs({
        data: this.editDeptForm
      }).then(res => {
        if (res.code === 0) {
          this.$message.success('新增组织成功')
          this.dialogClose()
          this.$emit('callback', 'success')
        }
      })
    },
    // 修改组织
    updateDept () {
      delete this.editDeptForm.children_list
      delete this.editDeptForm.children
      if (this.isProject) {
        this.editDeptForm.dept_type = '2'
      } else {
        this.editDeptForm.dept_type = '1'
      }
      // organizationApi.updateDept({       
      backEvaluateApi.editObs({//修改
        data: this.editDeptForm
      }).then(res => {
        if (res.code === 0) {
          this.$message.success('修改组织成功')
          this.dialogClose()
          this.$emit('callback', 'success')
        } else {
          this.editDeptForm.dept_type = this.deptType
        }
      })
    },
    // 获取组织类型
    getDeptType () {
      standardCodeApi.getStandardCodeData({
        data: {
          code_type: 'deptType'
        }
      }).then(res => {
        this.deptTypeList = res.data.list
      }).catch(error => {
        console.log(error)
      })
    }
  },
  created () {
    this.getDeptType()
  },
  mounted () {
  }
}
</script>
<style scoped lang='scss'>
</style>